---
import { type CollectionEntry, getCollection, render } from 'astro:content'

import BlogPost from '../../layouts/BlogPost.astro'

export async function getStaticPaths() {
  const posts = await getCollection('blog')

  return posts.map((post) => ({
    params: { slug: post.data.slug },
    props: post,
  }))
}

type Props = CollectionEntry<'blog'>

const post = Astro.props

const { Content } = await render(post)
---

<BlogPost {...post.data}>
  <Content />
</BlogPost>
